<style type="text/css">
textarea, input {
	display: block;
	width: 400px;
}
</style>

<script src="/depender/build?require=More/Element.Forms,Core/JSON,Core/Element.Event"></script>

<script type"text/javascript">

function EFexample(input, txt, value){
	$(input).getNext().value = txt + ": " + value;
}

</script>


<h3>Element.getTextInRange</h3>
<p>Returns the value of the text within a given range in the input.</p>

<p>
	text in range (click the input to execute):
	<input class="example" value="0123456789" id="ip1" /><input class="example" />
</p>

<script type="text/javascript">
$('ip1').addEvent('click', function(){
	EFexample(this, 'getTextInRange(2,5)', $(this).getTextInRange(2,5));
});
</script>



<h3>Element.getSelectedText</h3>
<p>Gets the text that is currently selected.</p>

<p>
	selected text (select some text to execute):
	<input class="example" value="0123456789" id="ip2" /><input class="example" />
</p>

<script type="text/javascript">
$('ip2').addEvent('select', function(){
	EFexample(this, 'getSelectedText', $(this).getSelectedText());
});
</script>



<h3>Element.getSelectedRange</h3>
<p>Gets the range that is selected.</p>

<p>
	getSelectedRange: (select some text to execute)
	<textarea class="example" value="0123456789" id="ip3">0123456789
0123456789
0123456789</textarea>
	<input class="example" />
</p>

<script type="text/javascript">
$('ip3').addEvent('select', function(){
	EFexample(this, 'getSelectedRange', JSON.encode($(this).getSelectedRange()));
});
</script>




<h3>Element.selectRange</h3>
<p>Selects a range of text.</p>

<p>
	selectRange (click to execute; this example passes in an array [2,5]):
	<textarea class="example" id="ip4">0123456789
0123456789
0123456789</textarea>
	<input class="example" />
</p>

<script type="text/javascript">
$('ip4').addEvent('click', function(){
	EFexample(this, 'selectRange(2,5)', ''); $(this).selectRange(2,5);
});
</script>




<h3>Element.insertAtCursor</h3>
<p>Insert text at the cursor location.</p>

<p>
	insertAtCursor (click anywhere to insert the example):
	<input class="example" value="0123456789" id="ip6" /><input class="example" />
</p>

<script type="text/javascript">
$('ip6').addEvent('click', function(){
	EFexample(this, 'insertAtCursor(\'!!!INSERTED!!!\')', $(this).insertAtCursor('!!!INSERTED!!!'));
});
</script>



<h3>Element.insertAroundCursor</h3>
<p>Wraps text with the given strings.</p>

<p>
	insertAroundCursor (select some text or click anywhere to insert "<" and ">" around the text, test multiple lines):

	<textarea class="example" cols="20" rows="3" id="ip7">0123456789
second line
third line</textarea>
	<input class="example" />
</p>

<script type="text/javascript">
$('ip7').addEvent('mouseup', function(){
	EFexample(this, 'insertAroundCursor({before: \'<\', after: \'>\'})', $(this).insertAroundCursor({before: '<', after: '>'}))
});
</script>


